<template>
  <div class="VCascader">
    <h1>This is an VCascader page</h1>
    <a-cascader :options="options" change-on-select @change="onChange">
      <a-icon slot="suffixIcon" type="smile" class="test" />
    </a-cascader>
  </div>
</template>
<script>
export default {
  data() {
    return {
      options: [
        {
          value: "zhejiang",
          label: "Zhejiang",
          children: [
            {
              value: "hangzhou",
              label: "Hangzhou",
              children: [
                {
                  value: "xihu",
                  label: "West Lake"
                }
              ]
            }
          ]
        },
        {
          value: "jiangsu",
          label: "Jiangsu",
          children: [
            {
              value: "nanjing",
              label: "Nanjing",
              children: [
                {
                  value: "zhonghuamen",
                  label: "Zhong Hua Men"
                }
              ]
            }
          ]
        }
      ]
    };
  },
  methods: {
    onChange(value) {
      console.log(value[0]);
    }
  }
};
</script>
